import React from 'react'
import {
  IconMenu,
  MenuItem,
  Divider,
  FlatButton,
} from 'material-ui'

import {
  inject,
  observer,
} from 'mobx-react'

@inject(stores => {
  return {
    appStore: stores.appStore,
    user: stores.appStore.user,
  }
})
@observer
class Logged extends React.Component {
  static muiName = 'FlatButton'

  logout = () => {
    this.props.appStore.logout().then(() => {
      
    })
  }

  render() {
    const { appStore, ...style } = this.props
    return (
      <IconMenu
        iconButtonElement={
          <FlatButton {...style}>{this.props.user.info.username}</FlatButton>
        }
      >
        <MenuItem primaryText="个人中心" />
        <MenuItem primaryText="创建博客" />
        <Divider />
        <MenuItem
          primaryText="登出"
          onClick={this.logout}
        />
      </IconMenu>
    )
  }
}

export default Logged
